import React from 'react';
import { Tree } from 'antd';
import { TextWidget, getMessage } from '@inbiz/react';

const { TreeNode, DirectoryTree } = Tree;

function TreeList(props) {
  const {
    list,
    selectedKeys,
    treeClick,
    onLoadData,
    checkable,
    checkedKeys,
    checkStrictly,
    treeCheck,
  } = props;

  // 渲染菜单
  const renderTreeNodes = (data) => {
    return data.map((item) => {
      if (item.children) {
        return (
          <TreeNode
            title={<TextWidget>{item.Name}</TextWidget>}
            key={item.OutId || item.key}
            dataRef={item}
            selectable={item.selectable}
          >
            {renderTreeNodes(item.children)}
          </TreeNode>
        );
      }
      return (
        <TreeNode
          title={<span title={getMessage(item.Name)}><TextWidget>{item.Name}</TextWidget></span>}
          key={item.OutId}
          {...item}
          dataRef={item}
        >
          <TextWidget>{item.Name}</TextWidget>
        </TreeNode>
      );
    });
  };

  return (
    <div>
      <DirectoryTree
        showIcon={false}
        blockNode={true}
        defaultSelectedKeys={selectedKeys}
        selectedKeys={selectedKeys}
        onSelect={(val) => treeClick([...val])}
        loadData={onLoadData}
        checkable={checkable}
        checkedKeys={checkedKeys}
        checkStrictly={checkStrictly}
        onCheck={(checkedKeys, e) => {
          treeCheck(checkedKeys, e);
        }}
      >
        {renderTreeNodes(list)}
      </DirectoryTree>
    </div>
  );
}

export default TreeList;
